import { proxy, ref } from 'valtio';
import { type IPanelView } from '.';
import type BasePanelService from '../../panels/base/service';
import { getPanelServiceByType } from '../../panels';
import DI from '../../utils/di';
import { type Element } from 'bpmn-js/lib/model/Types';
import DepartmentData from '../../controls/userSelector/selector/department/data';
import RoleData from '../../controls/userSelector/selector/role/data';

const log = (...args: any) => {
  // console.warn.call(args);
};

export default class BpmnPanelService extends DI implements IPanelView {

  isShow = false;
  current?: BasePanelService = undefined;

  // 顺序与ref有关，如果element 不实用ref赋值 element，会导致bpmn创建节点的时候报错
  // 如果加入了ref，则不会影响render，这里顺序也没有影响
  // 顺序会影响render，如果放在前面就会导致第一次render获取不到isShow，current
  element?: Element = undefined;

  department = new DepartmentData;
  role = new RoleData;

  constructor() {
    super();
    log('BpmnPanelService constructor');
  }

  mount() {
    log('mount');
    this.init();
  }

  unmount() {
    this.destroy();
  }

  show() {
    this.isShow = true;
  }

  hide() {
    this.isShow = false;
  }

  getElement() {
    if (!this.element) throw new Error('element is undefined');
    return this.element;
  }

  // = this.nodes.start;
  init() {
    // console.log('panelservice init');
    this.root.getModeler().on('selection.changed', (e: any) => {
      // loadXml 后会触发3次，前2次获取不到processElement
      // console.log('selection.changed', e);
      // this.data = {
      //     activeId: e.newSelection[0]?.id,
      // };

      // bpmn的element 需要使用ref排除，否则导致一些bug
      // bug1 修改id后，不能添加节点
      // bug2 render触发异常，第一次render获取到的对象属性丢失
      // 备注，此bug还不同于class原型链方法引用不变导致render不触发的bug
      if (e.newSelection[0]) {
        this.element = ref(e.newSelection[0]);
      } else {
        const processElement = this.root.getProcessElement();
        if (processElement) {
          this.element = ref(processElement);
        }
      }
      // console.log('this.element', this.element);
      this.initPanel();
    });

  }

  initElement() {
    // this.element = this.root.getProcessElement();
    // this.initPanel();
  }

  initPanel() {
    if (!this.element) return;

    const type = this.getElement().type;
    // console.log('initPanel', type);

    const PannelService = getPanelServiceByType(type);

    if (!PannelService) {
      // eslint-disable-next-line no-console
      console.warn('未适配的节点类型', type, 'not found');

      this.hide();
      return;
    }

    if (!this.current || !(this.current instanceof PannelService)) {
      this.current = proxy(new PannelService());
      this.current.bindBpmnService(this.root);
      this.current.bindPanelService(this);
    }

    // console.log('this.current', this.current);
    this.show();
    this.current.init();
    // this.id = this.current;
    // console.log('this.current', this.current);
    // setTimeout(()=>{
    //   this.current?.init();
    // },0);
    // else {
    //   console.log('panel面板不支持', type);
    //   this.current = null;
    // }
  }

  // nodes = {
  //   start: new StartService(),
  // };

  // get current(){
  //   return this.nodes.start;
  // }

  // render = this.nodes.start.render.bind(this.nodes.start);
  // get render (){
  //   return this.nodes.start.render;
  // }

  destroy() {
    this.root.getModeler().off('selection.changed');
  }
}
